<template>
    <header id="outerHeader">
        <section class="headerTop">
            <!-- logo -->

            <section id="left">
                <div class="img">
                    <img src="https://course.myhope365.com/img/logo-header.08ec1297.png" alt="" class="logo">

                </div>
                <Nav class="courseNav"></Nav>
            </section>

            <!-- 搜索 -->
            <Search></Search>
            <Login></Login>
        </section>

        <div style="clear:both"></div>
    </header>
</template>

<script>
    import Nav from './Nav'
    import Login from './Login'
    import Search from './Search'
    import '../myHeader.less'
    export default {
        name: "MyHeader",
        components:{
            Nav,
            Login,
            Search
        },
        data() {
            return {
                form: this.$form.createForm(this, { name: 'horizontal_login' }),
            }
        },
        methods: {
        },
        props: {
        },

        mounted() {
            this.$nextTick(() => {
                // To disabled submit button at the beginning.
                this.form.validateFields();
            });


        },

    }
</script>

<style>

    /* 头部开始 */
    header {
        margin: auto;
        width: 1200px;
    }
    .headerTop{
        padding-top: 20px;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        /* overflow: hidden; */
        width: 100%;
        /*height: 81px;*/
        /* background-color: #00cf8c; */
    }
    #left{
        display: flex;
        flex-wrap: wrap;
    }

    .headerTop>section>.img{
        width: 50%;
        margin: 0 38px  0 0 ;;
    }
    .headerTop>section>.img>img{
        width: 179.19px;
        height: 55px;
    }
    .headerTop>section>.courseNav{
        width: 50%;
    }



</style>